<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>INQueue</title>

    <link rel="stylesheet" href="/static/css/bootstrap-responsive.min.css">
    <link rel="stylesheet" href="/static/css/bootstrap.min.css">
    <link rel="stylesheet" href="/static/css/app.css">
    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

  </head>
<body>
{% macro flash_messages() %}
{% with messages = get_flashed_messages(with_categories=true) %}
{% if messages %}
<ul class="flashes unstyled">
  {% for category, message in messages %}
  <li class="alert alert-{{ category }}">
    <a class="close" data-dismiss="alert" href="#">×</a>
    {{ message }}
  </li>
  {% endfor %}
</ul>
{% endif %}
{% endwith %}
{% endmacro %}
{{ flash_messages() }}
  <div class="container-fluid">
  <div id="app_header">
    <div>
      {% if current_tab != 'home' %}
        <a class="back_button pull-left">Back</a>
      {% endif %}
      <a class="logo" href="{{ url_for('index') }}"><span id="app_logo">IN<strong>Queue</strong></span></a>
    </div>
  </div>

    {% block content %}
      {{super()}}
    {% endblock %}

  <div class="row-fluid">
    <div class="padding_bottom"></div>
  </div>

  <div class="row-fluid" id="app_footer">
    <div class="span4">
      <a class="{% if current_tab == 'home'%}current{% endif %}" href="{{ url_for('index') }}"><i class="icon-home"></i><br/>Home</a>
    </div>
    <div class="span4">
      <a class="{% if current_tab == 'trucks'%}current{% endif %}" href="{{ url_for('trucks') }}"><i class="icon-info-sign"></i><br/>Trucks</a>
    </div>
    <div class="span4">
      <a class="{% if current_tab == 'settings'%}current{% endif %}" href="{{ url_for('settings') }}"><i class="icon-cog"></i><br/>Settings</a>
    </div>
  </div>
  </div>

  <!--Javascripts-->
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
  <script src="/static/js/bootstrap.js"></script>
  <script src="/static/js/app.js"></script>

</body>
</html>
